<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title>个人中心2</title>
		<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
		<link rel="stylesheet" type="text/css" href="../css/index.css" />
		<link rel="stylesheet" type="text/css" href="../css/personal.css" />
		<script src="../js/vue.min.js" type="text/javascript" charset="utf-8"></script>
		<script src="../js/vant.min.js" type="text/javascript" charset="utf-8"></script>
		<script src="html5plus://ready"></script>
		<style type="text/css">
			#wei-Login {
				margin-top: -80px;
			}

			#wei-Login-2 {
				margin-top: 10px;
				margin-left: 106px;
			}

			#wei-Login-3 {
				margin-top: 10px;
				margin-left: 106px;
			}
		</style>
	</head>
	<body>
		
		<div id="app">
			
			<header>
				<!-- 头部开始 -->
				<div>
					<img v-model="imgUrl" 
					:src="imgUrl" 
					id="header-img" 
					onerror="javascript:this.src='../img/login-style.png';">
				</div><!-- 用户头像 -->
				<div id="wei-Login">
					<span style="color: white;" @click="User(0)">昵称：{{name}}</span>
					<br /><br />
					<span style="color: white;">帐号：{{phone}}</span>
				</div><!-- 登录标签 -->
				
			</header><!-- 头部结束 -->

			<section>
				<div id="icon-style">
					<!-- 图标开始 -->
					<van-row>
						<van-col span="6" >
							<van-icon name="shopping-cart-o" size="20px"></van-icon>
							<div id="" @click="User(1)">
								待付款
							</div>
						</van-col>
						<van-col span="6" >
							<van-icon name="records" size="20px"></van-icon>
							<div id="" @click="User(2)">
								待收货
							</div>
						</van-col>
						<van-col span="6" >
							<van-icon name="comment-o" size="20px"></van-icon>
							<div id="" @click="User(3)">
								待评论
							</div>
						</van-col>
						<van-col span="6" id="border-left" >
							<van-icon name="todo-list-o" size="20px"></van-icon>
							<div id="" @click="User(4)">
								我的订单
							</div>
						</van-col>
					</van-row>
				</div>
				<!--小图标结束 -->
				<div id="cell">
					<div >
						<van-cell title="个人资料" icon="contact" is-link @click="User(5)"
						class="cell-style"
						>
						
						</van-cell>
					</div>
						<van-cell title="收货地址" icon="location-o" is-link @click="User(6)" class="cell-style">
						
						</van-cell>
						<van-cell title="我的收藏" icon="like-o" is-link @click="User(7)" class="cell-style">
						
						</van-cell>
					
					<!-- 单元格开始 -->
					
				</div><!-- 单元格结束 -->

				<div id="cell">
					<!-- 单元格开始 -->
					<van-cell title="设置" icon="setting-o" is-link @click="User(8)" class="cell-style">
					</van-cell>
				</div><!-- 单元格结束 -->
			</section>
			<footer>
				<a href="../presoanl/login.html"></a>
			</footer>
		
		</div>
		
		<script type="text/javascript">
			var app = new Vue({
				el: "#app",
				data: {
					name: "点击登录",
					phone:"",
					imgUrl:""
					
				},
				mounted() {
					var _this=this;
					if (localStorage.getItem("name") != null) { //如果后台传过来的name不是空的
						_this.name = localStorage.getItem("name");  //进行赋值
						_this.phone = localStorage.getItem("phone");
						_this.imgUrl = localStorage.getItem('imgUrl')
					}
				},
				methods: {						
					User: function(n) {
						console.log(n);
						if (localStorage.getItem("name") == null) {
							plus.webview.create("../presoanl/login.html","login");
							plus.webview.show("login","slide-in-right");
						} else {
							switch (n) {
								case 1:
									plus.webview.create("../presoanl/payment.html","payment")//待付款页面
									plus.webview.show("payment","slide-in-right")								
									break;
								case 2:
									plus.webview.create("../presoanl/take.html","take")//待收货
									plus.webview.show("take","slide-in-right")							
									break;
								case 3:
									plus.webview.create("../presoanl/comment.html","comment")//待评论
									plus.webview.show("comment","slide-in-right")									
									break;
								case 4:
									plus.webview.create("../presoanl/order.html","order")//我的订单
									plus.webview.show("order","slide-in-right")									
									break;
								case 5:
									plus.webview.create("../presoanl/personal.html","personal")//个人资料
									plus.webview.show("personal","slide-in-right")									
									break;
								case 6:
									plus.webview.create("../presoanl/shipping.html","shipping")	;//收货地址
									plus.webview.show("shipping","slide-in-right");
									break;
								case 7:
									plus.webview.create("../presoanl/collect.html","like")	//收藏列表
									plus.webview.show("like","slide-in-right")
									break;
								case 8:
									plus.webview.create("../presoanl/set.html","set")//设置页面
									plus.webview.show("set","slide-in-right")								
									break;
								default:
									break;
							}
						}
					}
				}
			});
		</script>
		
	</body>
</html>
